<template>
	<view>
		<page-head :title="title"></page-head>
		<view class="uni-flex uni-row" v-if="xsinfo.xm ||jfinfo.xm">
			<view class="text" style="width: 200upx;">考生姓名</view>
			<view class="text" style="-webkit-flex: 1;flex: 1;">{{xsinfo.xm||jfinfo.xm}}</view>
		</view>
		<view class="uni-flex uni-row" v-if="xsinfo.zkzbh">
			<view class="text" style="width: 200upx;">准考证号</view>
			<view class="text" style="-webkit-flex: 1;flex: 1;">{{xsinfo.zkzbh}}</view>
		</view>
		<view class="uni-flex uni-row" v-if="xsinfo.zjhm ||jfinfo.zjhm">
			<view class="text" style="width: 200upx;">身份证号码</view>
			<view class="text" style="-webkit-flex: 1;flex: 1;">{{xsinfo.zjhm ||jfinfo.zjhm}}</view>
		</view>
		<view class="uni-flex uni-row" v-if="xsinfo.zjhm ||jfinfo.zjhm">
			<view class="text" style="width: 200upx;">预录取状态</view>
			<view v-if="jfinfo.jfzt == '0'" class="text" style="-webkit-flex: 1;flex: 1;">预录取</view>
			<view v-if="jfinfo.jfzt == '1'" class="text" style="-webkit-flex: 1;flex: 1;">已录取</view>
		</view>
		<view class="uni-flex uni-row" v-if="xsinfo.xm">
			<view v-if="jfinfo.jfzt == '0'" class="text" style="-webkit-flex: 1;flex: 1;">请考生点击下方"录取确认"办理确认手续</view>
		</view>
		<view v-if="xsinfo.zjhm && jfinfo.jfzt == '0'" class="uni-flex uni-row">
			<button v-if="xsinfo.zjhm && jfinfo.jfzt == '0'" type="primary" @click="qrlq()">录取确认</button>
		</view>

		<view v-if="formHide" class="uni-padding-wrap">
			<form @submit="formSubmit">
				<view class="uni-form-item uni-column inputsytle">
					<input style="height: 100rpx;" class="uni-input" type="idcard" v-model="sfzh" name="sfzh" placeholder="请输入身份证号" />
				</view>
				<view class="uni-btn-v inputsytle">
					<button type="primary" form-type="submit">提交</button>
				</view>
			</form>
		</view>
	</view>
</template>
<script>
	var _this;
	//来自 graceUI 的表单验证， 使用说明见手册 http://grace.hcoder.net/doc/info/73-3.html
	var  graceChecker = require("../../common/graceChecker.js");
	export default {
		data() {
			return {
				xsinfo:{
					xm:'',
					zkzbh:'',
					zjhm:'',
					lqzt:''
				},
				jfinfo:{
					jfzt:'0'
				},
				xm: '',
				title: '考生预录取状态查询',
				yxdm: '',
				sfzh: '',
				sfzh1: '',
				formHide: true,
				zsbh: ''
			}
		},
		async onLoad(options = {}) {
			vk = uni.vk;
			_this = this;
		},
		methods: {
			qrlq(){
				console.log('确认录取')
				vk.reLaunch('/pages_bd/gsxgj/tzxsdl?zjhm='+this.xsinfo.zjhm);
			},
			getXueJi(){
				vk.pubfn.debounce(() => {
				  vk.callFunction({
				    url: 'client/jp/pub/index.getzsxxone',
				    title:'请求中...',
				    data:{
				      zjhm: this.sfzh
				    }
				  }).then((data) => {

					  this.jfinfo = data.jfinfo
				    if(data.info || data.jfinfo){
						_this.xsinfo = data.info
				    	_this.formHide = false
				    }else{
				    	uni.showToast({title:"查无此人", icon:"none"})
				    }
				  }).catch((err) => {});
				}, 3000);
			},
			formSubmit: function(e) {
				let rule = [
					{name:"sfzh", checkType : "string", checkRule:"18,18",  errorMsg:"请输入正确的身份证号码"}
				]
				//进行表单检查
				let formData = e.detail.value
				let checkRes = graceChecker.check(formData, rule)
				if(checkRes){
					this.getXueJi()
					// uni.showToast({title:"验证通过!", icon:"none"})
				}else{
					uni.showToast({ title: graceChecker.error, icon: "none" })
				}
			}
		}
	}
</script>

<style>
	.uni-form-item .title {
		padding: 20rpx 0;
	}
	.inputsytle{
		padding: 10rpx;
	}
	.flex-item {
		width: 33.3%;
		height: 200upx;
		text-align: center;
		line-height: 200upx;
	}

	.flex-item-V {
		width: 100%;
		height: 150upx;
		text-align: center;
		line-height: 150upx;
	}

	.text {
		margin: 15upx 10upx;
		padding: 0 20upx;
		background-color: #ebebeb;
		height: 70upx;
		line-height: 70upx;
		text-align: center;
		color: #777;
		font-size: 26upx;
		color: #000000;
	}

	.desc {
		/* text-indent: 40upx; */
	}
</style>
